<template>
	<!--    章节练习答题页-->
	<view :class="{ 'yejian': if_theme_dark }">
		<!--#ifdef APP-PLUS-->
		<view class="lz-status_bar">
			<view class="lz-top_view"></view>
		</view>
		<!--#endif-->
		<view class="kaoshi-head" style="margin-top: 100px;">
			<view class="kaoshi-head-top">
				<view class="kaoshi-head-left" @tap="fanhui()">
					<view class="iconfont icon-zuojiantou"></view>
				</view>
				<view class="kaoshi-head-m">{{ orther.nickname }}</view>
				<!-- <view class="kaoshi-head-m">
					<view :class="{ 'moshi-active': !show_beiti, moshi: show_beiti }" @tap="show_beiti_click(false)">
						答题模式
					</view>
					<view :class="{ 'moshi-active': show_beiti, moshi: !show_beiti }" @tap="show_beiti_click(true)">背题模式
					</view>
				</view> -->
				<view class="kaoshi-head-right">
					<view class="">当前得分:{{ score }}</view>
				</view>
			</view>
		</view>
		<view scroll-y style="height: 100%;">
			<view style="height: 10px;"></view>
			<view class="questionBankAnswer" v-if="current_timu && current_timu.id">
				<!-- <question-type :current_timu="current_timu" :timu_order="timu_order" :total_num="total_num">
				</question-type> -->

				<question-type v-if="showCount" :current_timu="current_timu" :timu_order="timu_order" :over_time="over_time"
					@timeup="timeup"></question-type>
			</view>
			<view class="questionBankAnswer-content" v-if="current_timu && current_timu.question_name">
				<question-title :node="current_timu.question_name"></question-title>
				<block v-for="(item, index) in current_timu.answers" :key="index">
					<question-option :ref="'questionOption_' + index" :type="type" :item="item" :index="index"
						:show_beiti="show_beiti" :current_timu="current_timu" :copy_user_answer="copy_user_answer"
						:timu_index="timu_order - 1" :copy_post_status="copy_post_status" @post_answer_req="post_answer_req"
						@set_copy_user_answer="set_copy_user_answer" @set_sub_button_style="set_sub_button_style"></question-option>
				</block>
				<template v-if="current_timu.type == 4">
					<question-tiankong :current_timu="current_timu" :is_tiankong_sub="is_tiankong_sub" :show_beiti="show_beiti"
						@set_current_timu="set_current_timu" @post_answer_req="post_answer_req"
						@set_sub_button_style="set_sub_button_style"></question-tiankong>
				</template>
				<template v-else-if="current_timu.type == 5">
					<question-jianda :current_timu="current_timu" :is_jianda_sub="is_jianda_sub" :show_beiti="show_beiti"
						@set_current_timu="set_current_timu" @post_answer_req="post_answer_req"
						@set_sub_button_style="set_sub_button_style"></question-jianda>
				</template>
				<view v-if="current_timu.answers && (current_timu.type == 2) && !show_beiti">
					<button :class="is_duoxuan_sub ? 'duoxuan_checked' : 'duoxuan'" type=" " @tap="post_answer_req">{{
						is_duoxuan_sub ? '提交成功' : '确认答案' }}
					</button>
				</view>
				<!-- <question-pre-next2 v-if="timu_list.length > 0" :total_num="total_num" :timu_order="timu_order"
					:timu_list="timu_list" @choice_timu_by_id="choice_timu_by_id" @tap_handler="tap_handler"
					@dati_finsh="dati_finsh" 
					class="questionBankAnswer-contentbtnbox"></question-pre-next2> -->
			</view>
			<view v-if="current_timu.type == 5" class="jdttishi">温馨提示：简答题不记入错题，默认为正确</view>
			<question-answer ref="questionAnswer"
				v-if="current_timu && current_timu.answers && show_beiti || copy_post_status[current_timu.id]"
				:timu_order="timu_order" :show_beiti="show_beiti" :current_timu="current_timu"
				:copy_post_answer_right="copy_post_answer_right" :timu_list="timu_list"></question-answer>
			<view style="height: 50px;"></view>
		</view>
		<!-- 底部操作栏 -->
		<!-- <view class="order-pay">
			<question-fav class="questionBankAnswer-bottom-flex" :current_timu="current_timu" @collect_opt="collect_opt"
				:type="type"></question-fav>
			<question-note class="questionBankAnswer-bottom-flex" :current_timu="current_timu"></question-note>
			<question-jiucuo class="questionBankAnswer-bottom-flex" :current_timu="current_timu"></question-jiucuo>
			<question-answer-sheet class="questionBankAnswer-bottom-flex"
				@show_choice_timu_list="show_choice_timu_list = true"></question-answer-sheet>
		</view> -->
		<question-answer-sheet-1 v-if="show_choice_timu_list" @show_choice_timu_list="show_choice_timu_list = false"
			:timu_order="timu_order" :timu_list="timu_list" :my_res="my_res" :total_num="total_num"
			@choice_timu_by_id="choice_timu_by_id"></question-answer-sheet-1>
		<question-set :show_change_moshi="show_change_moshi" :if_theme_dark="if_theme_dark" @emptyLog="emptyLog"
			:show_empty="true" @set_if_theme_dark="set_if_theme_dark" @hide_change_moshi="show_change_moshi = false">
		</question-set>

		<overtimu v-if="show_over_dati" :timuinfo="over_dati_info" @tap_handler="tap_handler"></overtimu>
		<ifcontinue v-if="show_continue_answer" :timuorder="timu_order" @tap_handler="tap_handler"></ifcontinue>
	</view>
</template>

<script>
// 退出答题组件
import overtimu from '@/components/overtimu/index';
import {
	mapState
} from 'vuex';
import ifcontinue from "@/components/if-continue/index"

export default {
	data() {
		return {
			score: 0,
			my: {},//我的信息
			ortherobj: {},//对手信息 & 题目列表
			orther: {}, //对手信息
			showCount: true,
			dttype: -1,
			questionList: [
				// 	{
				// 	"id": 2,
				// 	"question_name": "下列物质的用途由其化学性质决定的是",
				// 	"type": "1",
				// 	"right_answer": "A",
				// 	"area": "选B。本题考查学生对物质的性质与用途的关系的掌握能力。解答本题的关键应明确两点：(1)一些常见物质的性质;(2)性质与用途的关系。纯碱是碳酸钠的俗称，能用作蒸馒头的膨松剂，是利用其与酸反应生成二氧化碳，是化学性质;而水银用作温度计中的液体，不锈钢制作炊具，干冰用于人工降雨则都是利用物质的物理性质。",
				// 	"answers": [
				// 		{
				// 			"id": 9,
				// 			"question_id": 2,
				// 			"answer_code": "A",
				// 			"answer": "水银用作温度计中的液体",
				// 			"type_text": ""
				// 		}
				// 		,
				// 		{
				// 			"id": 10,
				// 			"question_id": 2,
				// 			"answer_code": "B",
				// 			"answer": "纯碱用作蒸馒头的膨松剂",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 11,
				// 			"question_id": 2,
				// 			"answer_code": "C",
				// 			"answer": "不锈钢制作炊具",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 12,
				// 			"question_id": 2,
				// 			"answer_code": "D",
				// 			"answer": "干冰(固体二氧化碳)用作人工降雨",
				// 			"type_text": ""
				// 		}
				// 	],
				// 	"my_answer": "",
				// 	"type_text": "单选题"

				// },

				// {
				// 	"id": 3,
				// 	"question_name": "下列物质的用途由其化学性质决定的是22222",
				// 	"type": "1",
				// 	"right_answer": "A",
				// 	"area": "选B。本题考查学生对物质的性质与用途的关系的掌握能力。解答本题的关键应明确两点：(1)一些常见物质的性质;(2)性质与用途的关系。纯碱是碳酸钠的俗称，能用作蒸馒头的膨松剂，是利用其与酸反应生成二氧化碳，是化学性质;而水银用作温度计中的液体，不锈钢制作炊具，干冰用于人工降雨则都是利用物质的物理性质。",
				// 	"answers": [
				// 		{
				// 			"id": 19,
				// 			"question_id": 2,
				// 			"answer_code": "A",
				// 			"answer": "水银用作温度计中的液体",
				// 			"type_text": ""
				// 		}
				// 		,
				// 		{
				// 			"id": 13,
				// 			"question_id": 2,
				// 			"answer_code": "B",
				// 			"answer": "纯碱用作蒸馒头的膨松剂",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 14,
				// 			"question_id": 2,
				// 			"answer_code": "C",
				// 			"answer": "不锈钢制作炊具",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 15,
				// 			"question_id": 2,
				// 			"answer_code": "D",
				// 			"answer": "干冰(固体二氧化碳)用作人工降雨",
				// 			"type_text": ""
				// 		}
				// 	],
				// 	"my_answer": "",
				// 	"type_text": "单选题"

				// },

				// {
				// 	"id": 4,
				// 	"question_name": "下列物质的用途由其化学性质决定的是222224",
				// 	"type": "1",
				// 	"right_answer": "A",
				// 	"area": "选B。本题考查学生对物质的性质与用途的关系的掌握能力。解答本题的关键应明确两点：(1)一些常见物质的性质;(2)性质与用途的关系。纯碱是碳酸钠的俗称，能用作蒸馒头的膨松剂，是利用其与酸反应生成二氧化碳，是化学性质;而水银用作温度计中的液体，不锈钢制作炊具，干冰用于人工降雨则都是利用物质的物理性质。",
				// 	"answers": [
				// 		{
				// 			"id": 19,
				// 			"question_id": 2,
				// 			"answer_code": "A",
				// 			"answer": "水银用作温度计中的液体",
				// 			"type_text": ""
				// 		}
				// 		,
				// 		{
				// 			"id": 13,
				// 			"question_id": 2,
				// 			"answer_code": "B",
				// 			"answer": "纯碱用作蒸馒头的膨松剂",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 14,
				// 			"question_id": 2,
				// 			"answer_code": "C",
				// 			"answer": "不锈钢制作炊具",
				// 			"type_text": ""
				// 		},
				// 		{
				// 			"id": 15,
				// 			"question_id": 2,
				// 			"answer_code": "D",
				// 			"answer": "干冰(固体二氧化碳)用作人工降雨",
				// 			"type_text": ""
				// 		}
				// 	],
				// 	"my_answer": "",
				// 	"type_text": "单选题"

				// }

			],
			type: '', //from_type 1：章节练习  2：历年真题
			copy_post_answer_right: {},
			//区分多选题是否点击提交按钮
			is_duoxuan_sub: false,
			is_tiankong_sub: false,
			is_jianda_sub: false,
			//是否显示继续答题弹框
			show_continue_answer: false,
			//是否显示新用户左右滑动切换题目的提示
			guide: false,
			// 答题、背题模式
			show_beiti: false,
			// 上一题
			last_timu: {},
			// 当前题目
			current_timu: {},
			// 下一题
			next_timu: {},
			total_num: 0, //全部题目数
			// 用户输入的答案
			copy_user_answer: {},
			copy_right_answer_code: {},
			copy_post_status: {},
			// 是否显示退出答题弹框
			show_over_dati: false,
			over_dati_info: {},
			// 答题开始时间
			start_time: 0,
			// 显示答题卡
			show_choice_timu_list: false,
			// 答题卡
			timu_list: [],
			// 模式
			show_change_moshi: false,
			if_theme_dark: false, // 黑夜模式
			// 上次答到第几题
			timu_order: -1,
			current_tika_index: 0,
			my_res: {
				right_num: 0,
				error_num: 0
			},
			isEnd: false,//是否结束
			over_time: {
				hour: 0,
				minute: 0,
				second: 20
			}
		};
	},
	components: {
		overtimu,
		ifcontinue,
	},
	computed: {
		...mapState(['subject', 'userinfo']),
		static_media() {
			return {
				img01: this.$myConfig.localMedia + '/static/img/dui.png',
			}
		},
		// over_time() {
		// 	if (this.end_time > 0) {
		// 		let end = parseInt(new Date().getTime() / 1000);
		// 		let sec = parseInt(this.end_time - end);
		// 		let hour = parseInt(sec / 3600);
		// 		let miu = parseInt((sec - hour * 3600) / 60);
		// 		let s = sec - hour * 3600 - miu * 60;
		// 		return {
		// 			hour: parseInt(hour),
		// 			minute: parseInt(miu),
		// 			second: parseInt(s)
		// 		};
		// 	}
		// 	return {};
		// }
	},
	onBackPress() {
		console.log("返回");
		//发送失败，结算
		this.exitDati();
		this.over_dati();
		return true;
	},
	onUnload() { },
	onLoad(opts) {
		this.isEnd = false;//是否结束初始化
		console.log('%c [ opts ]-319', 'font-size:13px; background:pink; color:#bf2c9f;', opts)
		console.log("进来了");
		this.my = JSON.parse(opts.my)
		this.dttype = opts.match_type
		console.log('%c [ 匹配类型id ]-327', 'font-size:13px; background:pink; color:#bf2c9f;', this.dttype)
		this.ortherobj = JSON.parse(opts.orther)
		this.orther = this.ortherobj.data.rival
		console.log('%c [  this.ortherobj ]-ssss', 'font-size:13px; background:pink; color:#bf2c9f;', this.ortherobj)
		//将题目初始化
		this.questionList = this.ortherobj.data.question_list
		// console.log(this);
		console.log('%c [ this.copy_post_answer_right ]-722255', 'font-size:13px; background:pink; color:#bf2c9f;', this.copy_post_answer_right)
		// this.id = opts.id
		// this.type = opts.from_type
		if (this.userinfo.user_id !== undefined) {
			this.init();
		}
		// 答题开始时间
		this.start_time = new Date().getTime();

	},
	created() {
		//赢了的方法 被触发
		uni.$on('yingle', () => {
			console.log('赢了')
			this.win()
		})
		//输了的方法 被触发
		uni.$on('shule', () => {
			console.log('输了')
			this.lose()
		})
	},
	onReady() {
		uni.setNavigationBarTitle({
			title: this.type == 1 ? ' ' : ' '
		});
	},
	methods: {
		fanhui() {
			console.log('中途退出咯');
			//中途退赛
			//提示是否退赛
			const that = this
			uni.showModal({
				title: '提示',
				content: '是否退出比赛？',
				success: function (res) {
					console.log('%c [ res ]-370', 'font-size:13px; background:pink; color:#bf2c9f;', res)
					if (res.confirm == true) {
						that.exitDati()
						// this.over_dati()
					}

				}
			})
		},
		// 退出答题
		exitDati() {
			// 执行了退赛
			console.log('%c [ "执行了退赛" ]-383', 'font-size:13px; background:pink; color:#bf2c9f;', '执行了退赛')
			console.log('%c [  this.ortherobj ]-37222', 'font-size:13px; background:pink; color:#bf2c9f;', this.ortherobj)
			let that = this
			let token = JSON.parse(uni.getStorageSync('vuexvuex'))
			var parsedData = JSON.parse(token.value);
			var tokenValue = parsedData.userinfo.token;
			let tosend = {}
			tosend.type = 'exit_matching'
			tosend.token = tokenValue
			tosend.match_type = this.dttype
			tosend.matchId = this.ortherobj.data.matchId
			console.log('%c [  this.ortherobj ]-3703333', 'font-size:13px; background:pink; color:#bf2c9f;', this.ortherobj)
			console.log('%c [ tosend ]-373', 'font-size:13px; background:pink; color:#bf2c9f;', tosend)
			this.sendMsg(tosend)
		},
		winDati() {
			let that = this
			let token = JSON.parse(uni.getStorageSync('vuexvuex'))
			var parsedData = JSON.parse(token.value);
			var tokenValue = parsedData.userinfo.token;
			let tosend = {}
			tosend.type = 'answer_complete'
			tosend.token = tokenValue
			tosend.match_type = this.dttype
			tosend.matchId = this.ortherobj.data.matchId
			console.log('%c [ tosend ]-134', 'font-size:13px; background:pink; color:#bf2c9f;', tosend)
			this.sendMsg(tosend)
		},
		jump(res) {
			console.log('tiaozhuan');
			// 分数 输赢 对手
			uni.reLaunch({ url: '/pages/pkQuestionBank/questionOver/index?score=' + this.score + '&res=' + res + '&rival=' + this.orther })
			console.log('%c [ this.orther ]-394', 'font-size:13px; background:pink; color:#bf2c9f;', this.orther)
			console.log('%c [ res ]-394', 'font-size:13px; background:pink; color:#bf2c9f;', res)
			console.log('%c [ this.score ]-394', 'font-size:13px; background:pink; color:#bf2c9f;', this.score)
		},
		lose() {
			if (this.isEnd) {
				return
			}
			this.isEnd = true
			uni.showModal({
				title: '噢不，你输掉了比赛！',
				content: `你的得分${this.score}`,
				success: res => {
					if (res.confirm) {
						//发送失败，结算F
						// this.exitDati();
						// this.over_dati();

						this.jump('你输了')

					} else if (res.cancel) {
						console.log('用户点击取消');
						this.jump('你输了')
					}
				}
			});
		},
		win() {
			if (this.isEnd) {
				return
			}
			this.isEnd = true
			uni.showModal({
				title: 'Yes!你赢得了胜利！',
				content: `你的得分${this.score}`,
				success: res => {

					if (res.confirm) {
						//发送失败，结算
						// this.winDati();
						this.jump('你赢了')

					} else if (res.cancel) {
						console.log('用户点击取消');
						this.jump('你赢了')

					}
				}
			});
		},
		sendMsg(data) {
			wx.sendSocketMessage({
				data: JSON.stringify(data)
			})
		},
		dati_finsh() {
			console.log("答题完成");
			this.winDati();
			//赢的结果
		},
		timeup() {
			if (this.isEnd) {
				return
			}

			//在这里发送，判失败
			console.log('%c [  this.ortherobj ]-37222', 'font-size:13px; background:pink; color:#bf2c9f;', this.ortherobj)
			this.exitDati()
			uni.showToast({
				title: '时间到了',
				icon: 'error',
				mask: true
			})
		},
		async init() {
			// 获取题目信息
			this.get_timu_list();
		},
		set_sub_button_style(type, value) {
			if (this.copy_post_status[this.current_timu.id]) {
				console.log("提交答案222");
				return
			}
			this[type] = value
		},
		set_current_timu(data) {
			this.current_timu = JSON.parse(JSON.stringify(data))
			let copy_user_answer_this = this.copy_user_answer;
			if (copy_user_answer_this[this.current_timu.id]) {
				copy_user_answer_this[this.current_timu.id] = this.current_timu.my_answer_arr
			}
		},
		set_copy_user_answer(data) {
			// 判断是否答题,已经答题的不再提交
			if (this.copy_post_status[this.current_timu.id]) {
				console.log("提交答案222");
				return
			}
			this.copy_user_answer = JSON.parse(JSON.stringify(data))
			this.setAnswerStyle(this.current_timu);
			this.setMyAnswer();
		},
		// 提交答案
		async post_answer_req() {
			console.log("提交答案");
			// 判断是否答题,已经答题的不再提交
			if (this.copy_post_status[this.current_timu.id]) {
				console.log(this.copy_post_status);
				console.log(this.copy_post_answer_right);
				console.log(this.timu_list);
				console.log("提交答案222");
				return
			}
			console.log("提交答案111");
			let noanswer = false
			let answerlist = this.copy_user_answer[this.current_timu.id]
			if (this.current_timu.type == 2) {
				for (var i = 0; i < answerlist.length; i++) {
					if (answerlist[i].active) {
						noanswer = true
					}
				}
			} else if (this.current_timu.type == 4 || this.current_timu.type == 5) {
				if (answerlist.length != 0) {
					noanswer = true
					for (var i = 0; i < answerlist.length; i++) {
						if (!answerlist[i] || answerlist[i] == '') {
							noanswer = false
						}
					}
				}
			} else {
				noanswer = true
			}
			if (!noanswer) {
				uni.showToast({
					title: '您还未答题',
					icon: 'none'
				})
				return
			}
			let timu_index = this.timu_order - 1;
			this.copy_post_status = Object.assign({}, this.copy_post_status, {
				[this.current_timu.id]: true
			});
			let answer = '';
			if (this.current_timu.type <= 3) {
				this.is_duoxuan_sub = true
				let answers = this.copy_user_answer[this.current_timu.id];
				for (let i = 0, leng = answers.length; i < leng; i++) {
					if (answers[i].active) {
						answer += answers[i].answer_code
					}
				}
				if (this.current_timu.right_answer.toString().toLowerCase().replace(/\s/g, '') === answer
					.toString().toLowerCase().replace(/\s/g, '')) {
					this.copy_post_answer_right = Object.assign({}, this.copy_post_answer_right, {
						[this.current_timu.id]: true
					});
					if (timu_index !== -1) {
						// if_que 答题状态：1是错2是对3是未答过此题
						this.setTimuState(timu_index, 2)
					}
				} else {
					if (timu_index !== -1) {
						this.setTimuState(timu_index, 1)
					}
				}
			} else {
				if (this.current_timu.type == 4) {
					this.is_tiankong_sub = true
					if (this.current_timu.my_answer == this.current_timu.right_answer) {
						if (timu_index !== -1) {
							// if_que 答题状态：1是错2是对3是未答过此题
							this.setTimuState(timu_index, 2)
						}
					} else {
						if (timu_index !== -1) {
							// if_que 答题状态：1是错2是对3是未答过此题
							this.setTimuState(timu_index, 1)
						}
					}
				} else {
					this.is_jianda_sub = true
					if (this.current_timu.my_answer == this.current_timu.right_answer) {
						if (timu_index !== -1) {
							// if_que 答题状态：1是错2是对3是未答过此题
							this.timu_list.splice(timu_index, 1, {
								...this.timu_list[timu_index],
								state: 2
							})
						}
					} else {
						if (timu_index !== -1) {
							// if_que 答题状态：1是错2是对3是未答过此题
							this.timu_list.splice(timu_index, 1, {
								...this.timu_list[timu_index],
								state: 1
							})
						}
					}
				}
				this.is_jianda_sub = true
			}
			let url = ''
			// 1：章节练习  2：历年真题
			if (this.type == 1) {
				// 1：章节练习
				url = this.$myHttp.urlMap.unitansqueedit
			} else if (this.type == 2) {
				// 2：历年真题
				url = this.$myHttp.urlMap.zhentiansqueedit
			}
			let that = this;
			let res = await this.$myHttp.post({
				url: url,
				data: {
					id: this.current_timu.id,
					answer: this.current_timu.type <= 3 ? answer : this.current_timu.my_answer
				},
				needLogin: true
			});
			if (res.code == 1) {
				//0:错，1：对
				that.$set(this.current_timu, 'post_status', 1)
				this.setAnswerStyle(this.current_timu);
				this.setMyAnswer();
			}

			console.log("答题完成收拾");
			this.showCount = false;

			//跳转下一题,0.3秒后跳转
			setTimeout(() => {
				this.choice_timu_by_id(this.timu_order);

			}, 800);


			// this.choice_timu_by_id(this.timu_order);
		},
		//答题完成后，设置答题卡颜色
		setTimuState(timu_index, state) {
			this.timu_list.splice(timu_index, 1, {
				...this.timu_list[timu_index],
				state: state
			})
			this.get_my_res();
			//TODO 答题对错这里，需要进一步 优化
		},
		collect_opt(type) {
			this.$set(this.current_timu, 'is_fav', type)
		},

		// 获取答题卡
		async get_timu_list() {
			let data = {}
			let url = ''

			// // 1：章节练习  2：历年真题
			// if (this.type == 1) {
			// 	// 1：章节练习
			// 	data = {
			// 		unit_id: this.id
			// 	};
			// 	url = this.$myHttp.urlMap.unitCard
			// } else if (this.type == 2) {
			// 	// 2：历年真题
			// 	data = {
			// 		library_id: this.id
			// 	};
			// 	url = this.$myHttp.urlMap.zhentiCard
			// }


			//构造数据
			let dataCard = [];
			// curr_question
			let dataCurrQuestion = {};
			let dataPosition = 0;
			//循环questionList
			for (let i = 0; i < this.questionList.length; i++) {

				//构造dataCard
				dataCard.push({
					id: this.questionList[i].id,
					state: 3
				})
				//构造dataCurrQuestion
				if (i == 0) {
					dataCurrQuestion = this.questionList[i]
				}
			}
			console.log('%c [ this.questionList ]-580', 'font-size:13px; background:pink; color:#bf2c9f;', this.questionList)
			console.log(dataCurrQuestion);
			console.log('%c [ dataCurrQuestion ]-591', 'font-size:13px; background:pink; color:#bf2c9f;', dataCurrQuestion)
			console.log(dataCard);
			console.log('%c [ dataCard ]-593', 'font-size:13px; background:pink; color:#bf2c9f;', dataCard)


			// let res = await this.$myHttp.post({
			// 	url: url,
			// 	data: data,
			// 	needLogin: true
			// });
			// if (res.code == 1) {
			//获取答题卡状态 序号 和 答题状态：1是错2是对3是未答过此题
			this.timu_list = dataCard;
			// 题目数量
			this.total_num = this.timu_list.length;
			//当前题目的序号
			this.timu_order = dataPosition
			// 改变题目的时候触发的状态
			this.isChangeTimu = false
			//获取当前题目
			if (dataCurrQuestion != []) {
				//设置正确答案的标记
				let timu = this.set_right_flg(dataCurrQuestion);
				this.current_timu = timu;
				this.save_user_answer(this.current_timu);
				this.is_duoxuan_sub = false
				this.is_tiankong_sub = false
				this.is_jianda_sub = false
			} else {
				this.current_timu = null;
			}


			this.get_my_res();
			// }
		},
		get_my_res() {
			let error_num = 0,
				right_num = 0;
			for (let i = 0, leng = this.timu_list.length; i < leng; i++) {
				//if_que 答题状态：1是错2是对3是未答过此题
				if (this.timu_list[i].state == 1) {
					error_num++
				} else if (this.timu_list[i].state == 2) {
					right_num++
				}
			}
			this.$set(this.my_res, 'right_num', right_num)
			this.$set(this.my_res, 'error_num', error_num)
		},
		// 获取用户答到第几题
		// async get_timu_order() {
		// 	let data = {}
		// 	let url = ''
		// 	// 1：章节练习  2：历年真题
		// 	if (this.type == 1) {
		// 		// 1：章节练习
		// 		data = {
		// 			unit_id: this.id
		// 		};
		// 		url = this.$myHttp.urlMap.unit_postion
		// 	} else if (this.type == 2) {
		// 		// 2：历年真题
		// 		data = {
		// 			library_id: this.id
		// 		};
		// 		url = this.$myHttp.urlMap.zhenti_postion
		// 	}


		// 	let res = await this.$myHttp.post({
		// 		url: url,
		// 		data: data,
		// 		needLogin: true
		// 	});

		// 	if (res.code == 1) {
		// 		this.timu_order = res.data
		// 		this.get_timu_info();
		// 	}
		// },
		// 根据答题卡获取题目
		choice_timu_by_id(index) {

			console.log("object", index);
			console.log("切换题目，上一题和下一题");
			this.timu_order = index + 1
			this.isChangeTimu = true

			//获取下一个题目信息
			this.get_timu_info()
			console.log("当前题目", this.current_timu);
			//页面滚动
			uni.pageScrollTo({
				scrollTop: 0,// 滚动到页面的顶部
				duration: 200// 滚动动画持续时间为 200 毫秒
			});
			//判断如果是最后一个题目，就提示
			//循环题目列表，统计正确数量
			let right_num = 0;
			let error_num = 0;
			for (let i = 0; i < this.timu_list.length; i++) {
				if (this.copy_post_answer_right[this.timu_list[i].id]) {

					right_num++;
				} else {
					error_num++;
				}
			}
			this.score = right_num * 10
			console.log('%c [ this.score ]-761', 'font-size:13px; background:pink; color:#bf2c9f;', this.score)
			console.log("答对题目数量", right_num);
			console.log("答错题目数量", error_num);
			if (this.score >= 100) {
				//提示，已经是最后一题
				uni.showToast({
					title: '恭喜你，答题完成',
					icon: 'none'
				});
				this.showCount = false;
				// this.post_answer_req();
				this.dati_finsh();
				return
			} else {
				this.showCount = true;
				//时间重置20秒
				this.over_time = {
					hour: 0,
					minute: 0,
					second: 20
				}
			}
		},
		// 获取当前题目
		async get_timu_info() {

			console.log("获取当前题目");
			//从questionList中获取当前题目
			let dataData = this.questionList[this.timu_order]

			if (dataData) {
				this.isChangeTimu = false
				if (dataData != []) {
					console.log(this.timu_order);
					console.log("切换", dataData);
					let timu = this.set_right_flg(dataData);
					this.current_timu = timu;
					this.save_user_answer(this.current_timu);
					this.is_duoxuan_sub = false
					this.is_tiankong_sub = false
					this.is_jianda_sub = false
				} else {
					this.current_timu = null;
				}
			} else {
				this.isChangeTimu = false
			}
		},
		// 设置正确答案的标记
		set_right_flg(timu) {
			// 题目类型 1单选 2多选 3判断 4填空 5简答题
			if (timu.type <= 3) {
				// 如果题目类型小于等于3（可能表示选择题、判断题等）

				// 设置题目的提交状态为0（假设是错误的状态）,0未提交
				timu.post_status = 0;

				// 如果题目具有答案选项
				if (timu.answers) {
					// 遍历题目的答案选项
					for (let i = 0, leng = timu.answers.length; i < leng; i++) {
						// 判断答案选项是否在正确答案中
						if (timu.right_answer.toString().toLowerCase().replace(/\s/g, '').indexOf(timu.answers[i]
							.answer_code.toString().toLowerCase().replace(/\s/g, '')) !== -1) {
							// 如果在正确答案中，将答案选项的 'right_flg' 属性设置为 true
							timu.answers[i]['right_flg'] = true;
						}
						console.log("遍历题目", timu);
					}
				}
			}
			console.log("获取题目", timu);
			return timu
		},

		// 本地存储用户答案
		save_user_answer(timu) {
			if (timu.type <= 3) {
				if (timu && timu.answers) {
					//copy_user_answer 用户输入的答案,
					//如果copy_user_answer中没有保存过当前题目的用户答案
					if (!(this.copy_user_answer[timu.id])) {
						// 初始化保存用户答案的数据结构
						this.copy_user_answer = Object.assign({}, this.copy_user_answer, {
							[timu.id]: []
						});
						//copy_right_answer_code 本题的正确答案
						//  // 保存当前题目的正确答案
						this.copy_right_answer_code = Object.assign({}, this.copy_right_answer_code, {
							[timu.id]: timu.right_answer
						});
						//copy_post_status 本题答没答过
						// 初始化保存当前题目是否答过的状态
						this.copy_post_status = Object.assign({}, this.copy_post_status, {
							[timu.id]: false
						});
						//copy_post_answer_right  本题答的是对是错
						// 初始化保存当前题目答案是否正确的状态
						this.copy_post_answer_right = Object.assign({}, this.copy_post_answer_right, {
							[timu.id]: false
						});
						// 将题目的答案选项添加到用户答案中
						for (let i = 0, leng = timu.answers.length; i < leng; i++) {
							this.copy_user_answer[timu.id].push({
								answer_code: timu.answers[i].answer_code,
								error_flg: false,
								active: false
							})
						}
						// 如果用户已经回答过该题目，则设置用户答案
						if (timu.my_answer !== '' && timu.my_answer !== null) {
							this.setUserAnswer(timu)
						} else {
							// 如果用户还未回答过该题目，则设置答案样式
							this.setAnswerStyle(timu);
						}
					} else {
						// 如果copy_user_answer中已经保存过当前题目的用户答案，则设置答案样式
						this.setAnswerStyle(timu);
					}
				}
			} else {
				let right_answer_arr = timu.right_answer.split('|');
				this.$set(timu, 'right_answer_arr', right_answer_arr)
				this.$set(timu, 'show_right_answer', false)
				if (!(this.copy_user_answer[timu.id]) || this.copy_user_answer[timu.id].length == 0) {
					//本地没有记录呢，如果my_answer有值，写进去
					this.copy_user_answer = Object.assign({}, this.copy_user_answer, {
						[timu.id]: []
					});
					this.copy_post_status = Object.assign({}, this.copy_post_status, {
						[timu.id]: false
					});
					if (timu.my_answer == '' || timu.my_answer == null) {
						//之前没有答过题
						let arr = [];
						arr.length = right_answer_arr.length;
						this.$set(timu, 'my_answer_arr', arr)
						this.$set(timu, 'my_answer', '')
						this.setAnswerStyle(timu);
					} else {
						//之前答过题了
						this.setUserAnswer(timu)
					}
				} else {
					//之前答过题了
					this.setUserAnswer(timu)
				}
			}
		},
		//获取题目信息后，如果答过题了，设置到本地
		setUserAnswer(timu) {
			//timu.my_answer !== '' && timu.my_answer !== null  说明这道题已经回答过了
			this.copy_post_status = Object.assign({}, this.copy_post_status, {
				[timu.id]: true
			});
			// 如果是判断和单选。执行以下处理
			if (timu.type == 1 || timu.type == 3) {
				let index = timu.answers.findIndex(item => item.answer_code == timu.my_answer)
				// this.$nextTick(() => {
				if (this.copy_user_answer[timu.id]) {
					for (let i = 0, leng = this.copy_user_answer[timu.id].length; i <
						leng; i++) {
						this.copy_user_answer[timu.id].splice(i, 1, {
							...this.copy_user_answer[timu.id][i],
							active: false,
							error_flg: false
						})
					}
					if (timu.right_answer.toString().toLowerCase().replace(/\s/g, '').indexOf(
						timu.my_answer.toString().toLowerCase().replace(/\s/g, '')) === -1) {
						this.copy_user_answer[timu.id].splice(index, 1, {
							...this.copy_user_answer[timu.id][index],
							active: true,
							error_flg: true
						})
					} else {
						this.copy_user_answer[timu.id].splice(index, 1, {
							...this.copy_user_answer[timu.id][index],
							active: true,
							error_flg: false
						})
					}
				}
				// });
			} else if (timu.type == 2) {
				// 如果是多选。执行以下处理
				if (this.copy_user_answer[timu.id]) {
					if (this.is_duoxuan_sub = true) {
						this.is_duoxuan_sub = false
					}
					for (let key of timu.my_answer) {
						let index = timu.answers.findIndex(item => item.answer_code == key)
						if (this.copy_user_answer[timu.id][index]) {
							if (this.copy_user_answer[timu.id][index].active) {
								if (timu.right_answer.toString().toLowerCase().replace(/\s/g, '').indexOf(key
									.toString().toLowerCase().replace(/\s/g, '')) === -1) {
									this.copy_user_answer[timu.id].splice(index, 1, {
										...this.copy_user_answer[timu.id][index],
										active: false,
										error_flg: true
									})
								} else {
									this.copy_user_answer[timu.id].splice(index, 1, {
										...this.copy_user_answer[timu.id][index],
										active: false,
										error_flg: false
									})
								}
							} else {
								if (timu.right_answer.toString().toLowerCase().replace(/\s/g, '').indexOf(key
									.toString().toLowerCase().replace(/\s/g, '')) === -1) {
									this.copy_user_answer[timu.id].splice(index, 1, {
										...this.copy_user_answer[timu.id][index],
										active: true,
										error_flg: true
									})
								} else {
									this.copy_user_answer[timu.id].splice(index, 1, {
										...this.copy_user_answer[timu.id][index],
										active: true,
										error_flg: false
									})
								}
							}
						}
					}
				}
			} else {
				// 如果是填空，简答
				this.$set(timu, 'my_answer_arr', timu.my_answer.split('|'))
				this.$set(timu, 'my_answer', timu.my_answer)
				this.$set(timu, 'show_right_answer', true)
				this.copy_user_answer = Object.assign({}, this.copy_user_answer, {
					[timu.id]: []
				});
				this.copy_user_answer[timu.id].push(...timu.my_answer_arr)
			}
			this.setAnswerStyle(timu);
		},
		//单选多选判断，选项正确错误
		setAnswerStyle(timu) {
			this.$nextTick(() => {
				timu.answers.forEach((item, index) => {
					this.$refs['questionOption_' + index][0].setAnswerStyle(this.copy_user_answer);
				})
				this.setMyAnswer();
			})
		},
		setMyAnswer() {
			if (this.show_beiti || this.copy_post_status[this.current_timu.id]) {
				// this.$nextTick(() => {
				this.$refs.questionAnswer.my_answer(this.copy_user_answer)
				// })
			}
		},
		//设置夜间模式
		set_if_theme_dark(data) {
			this.if_theme_dark = data
		},

		//清空答题卡记录
		emptyLog() {
			let that = this
			uni.showModal({
				title: "警告",
				content: "清除记录后错题记录也会清除，请谨慎操作",
				confirmText: "确认清除",
				confirmColor: '#3c7bfc',
				success: function success(res) {
					if (res.confirm) {
						that.emptyTestLog();
					} else if (res.cancel) {
						// console.log("用户点击取消");
					}
				}
			});
		},

		async emptyTestLog() {
			let data = {}
			let url = ""
			if (this.type == 1) {
				// 1：章节练习
				data = {
					unit_id: this.id
				};
				url = this.$myHttp.urlMap.emptyTestLog
			} else if (this.type == 2) {
				// 2：历年真题
				data = {
					library_id: this.id
				};
				url = this.$myHttp.urlMap.emptyLibraryLog
			}
			let res = await this.$myHttp.post({
				url: url,
				data: data,
				needLogin: true
			});
			if (res.code == 1) {
				this.get_timu_list();
				// this.get_timu_order();
				this.show_change_moshi = false;
				this.copy_user_answer = {}
			}
		},
		// 中途退出
		over_dati() {
			console.log("中途退出");
			this.over_dati_info = {
				total_num: this.total_num,
				zhengquelv: (100 * (this.my_res.right_num / ((this.my_res.right_num + this.my_res.error_num == 0) ?
					1 : (this.my_res.right_num + this.my_res.error_num)))).toFixed(2),
				right_num: this.my_res.right_num,
				error_num: this.my_res.error_num,
				yida_num: this.my_res.right_num + this.my_res.error_num
			};
			// console.log(this.over_dati_info)
			this.$nextTick(() => {
				// 显示弹窗
				this.show_over_dati = true;
			});
		},
		tap_handler(type) {
			if (type == 0) {
				this.show_over_dati = false;
			} else if (type == 1) {
				this.$redirectTo(
					'/pages/questionBank/questionOver/index?id=' +
					this.id +
					'&from_type=' +
					this.type +
					'&end_time=' +
					this.endtime() +
					'&right_num=' +
					this.my_res.right_num +
					'&start_time=' +
					this.start_time +
					'&zhengquelv=' +
					100 * (this.my_res.right_num / ((this.my_res.right_num + this.my_res.error_num == 0) ? 1 : (
						this.my_res.right_num + this.my_res.error_num))).toFixed(2) +
					'&total_num=' +
					(this.my_res.right_num + this.my_res.error_num) || 0
				)
			} else if (type == 3) {
				this.show_continue_answer = false;
				this.choice_timu_by_id({
					id: this.timu_order
				})
			} else if (type == 4) {
				this.show_continue_answer = false;
				this.get_timu_info();
			}
		},
		show_beiti_click(type) {
			this.show_beiti = type;
			this.setAnswerStyle(this.current_timu);
		},

		endtime() {
			let yy = new Date().getFullYear();
			let mm = new Date().getMonth() < 10 ? "0" + (new Date().getMonth() + 1) : new Date().getMonth() + 1;
			let dd = new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate();
			let hh = new Date().getHours();
			let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes();
			let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds();
			return yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss
		}
	}
};
</script>

<style>
@import "~@/static/css/tiku.css";
</style>
